<template>
  <div class="strut-div">
    <div class="strut-div">
      <div :id="config.option.id" class="strut-div"></div>
    </div>
  </div>
</template>

<script>
  import echarts from 'echarts';
	import autoHover from '../../util/autoHover.js';
  export default {
    name: "CommonGaugeChart",
    props: ['config'],
    data() {
      return {
        chart: null,
				timeTicket:null,
      }
    },
    methods: {
      initChart() {
        let option = {
          tooltip: {
            formatter: "{a} <br/>{b} : {c}" + this.config.option.title,
            borderColor: "#333",		// 提示框浮层的边框颜色。...
            borderWidth: 0,				// 提示框浮层的边框宽。...
            padding: 5,
            backgroundColor: "rgba(50,50,50,0.7)",
          },
          textStyle: {
            fontSize: '12'
          },
          series: this.config.option.series
        }
        setTimeout(() => {

          this.chart.setOption(option);
					this.timeTicket = autoHover.autoHover(this.chart,option,1);
        }, 300);

      },
      refreshChart() {

      },
    },
    mounted() {
      console.log("mounted");
      this.chart = echarts.init(document.getElementById(this.config.option.id));
    },
		beforeDestroy() {
			autoHover.stopHover(this.timeTicket);
		}

  }
</script>

<style scoped lang="scss" type="text/scss">

</style>
